<!--登录-->
<template>
    <div class="login" clearfix>
        <div class="logo">
            <span class="iconfont icon-info icon-jifenshangcheng"></span>
            <div class="logo_title">忍一下购物</div>
        </div>
        <div class="login-wrap">
            <el-row type="flex" justify="center">
                <el-form ref="loginForm" :model="user" status-icon label-width="80px">
                    <h3>登录</h3>
                    <hr>
                    <el-form-item prop="username" label="用户名">
                        <el-input v-model="user.username" placeholder="请输入用户名" prefix-icon></el-input>
                    </el-form-item>
                    <el-form-item id="password" prop="password" label="密码">
                        <el-input v-model="user.password" show-password placeholder="请输入密码"></el-input>
                    </el-form-item>
                    <br>
                    <el-form-item>
                        <el-button type="primary" icon="el-icon-upload" @click="doLogin()">登 录</el-button>
                    </el-form-item>
                    <router-link to="/">找回密码</router-link>
                    <br>
                    <router-link to="/Register">注册账号</router-link>
                </el-form>
            </el-row>
        </div>
    </div>
</template>

<script>

import '../image/LOGO/iconfont.css'
export default {
    name: "Login",
    data() {
        return {
            user: {
                username: '',
                password: ''
            }
        }
    },
    methods: {
        doLogin:{

        }
    }
}
</script>

<style scoped>
.logo {
    width: 200px;
    height: 200px;
    margin: auto;
    border-radius: 15%;
    font-size: 27px;
    margin-top: 50px;
    text-align: center;
}
.icon-info {
    font-size: 147px
}
.login {
    width: 100%;
    height: 740px;
    /*background: url("../assets/images/bg1.png") no-repeat;*/
    background-size: cover;
    overflow: hidden;
}

.login-wrap {
    /*background: url("../assets/images/login_bg.png") no-repeat;*/
    background-size: cover;
    width: 600px;
    height: 400px;
    margin: 0px auto;
    overflow: hidden;
    padding-top: 10px;
    line-height: 40px;
}

#password {
    margin-bottom: 5px;
}

h3 {
    color: #0babeab8;
    font-size: 24px;
    text-align: center;
}

hr {
    background-color: #444;
    margin: 20px auto;
}

a {
    text-decoration: none;
    color: #aaa;
    font-size: 15px;
}

a:hover {
    color: coral;
}

.el-button {
    width: 80%;
    margin-left: -50px;
}
</style>